<template>
	<view class="container">
		<block v-if="show">
		<view class="form-container">
			<view class="submit-form-group">
				<view class="form-row">
					<view class="left">手机号码</view>
					<view class="right">{{mobile}}</view>
				</view>
				<view class="form-row" v-if="edit_pwd_sms_enable==0">
					<view class="left">原密码</view>
					<input type="password" placeholder="请输入原密码" placeholder-class="input-placeholder26" class="form-row-input" v-model="form.oldpassword" />
				</view>
				<view class="form-row">
					<view class="left">新密码</view>
					<input type="password" placeholder="请输入新密码" placeholder-class="input-placeholder26" class="form-row-input" v-model="form.password" />
				</view>
				<view class="form-row">
					<view class="left">确认密码</view>
					<input type="password" placeholder="请输入确认密码" placeholder-class="input-placeholder26" class="form-row-input" v-model="form.conpassword" />
				</view>
				<view class="form-row" v-if="edit_pwd_sms_enable==1">
					<view class="left">验证码</view>
					<input type="text" placeholder="请输入验证码" placeholder-class="input-placeholder26" class="form-row-input" v-model="form.code" />
					<view class="code-container">
						<u-code ref="uCode1" startText="验证码" :seconds="sms_time_out" @change="codeChange" keep-running change-text="Xs"
							@start="disabled = true" @end="disabled = false"></u-code>
						<button size="mini" @tap="getCode" :disabled="disabled" class="code-btn">{{tips}}</button>
					</view>
				</view>
			</view>
			<button type="default" class="submit-btn" :disabled="btnDisabled" @click="confirm">确认</button>
		</view>
		</block>
	</view>
</template>

<script>
	var validate = require("@/components/validate/validate.js");
	var _this;
	export default {
		data() {
			return {
				btnDisabled:false,
				show:false,
				edit_pwd_sms_enable: '0',
				sms_time_out: 60,
				mobile: '正在获取...',
				tips: '',
				disabled: false,
				form: {
					step: 1,
					oldpassword: '',
					password: '',
					conpassword: '',
					code: '',
				},
			}
		},
		onLoad() {
			_this=this
			this.Submit()
		},
		methods: {
			//获取验证码
			codeChange(text) {
				this.tips = text;
			},
			confirm() {
				this.form.step = 2
				this.Submit()
			},
			async getCode() {
				if (this.$refs.uCode1.canGetCode) {
					const params = {
						mobile: this.mobile,
						scene: 4
					}
					const data = await _this.$post('api/GetCode',params)
					if (data.code == 200) {
						uni.hideLoading();
						// 这里此提示会被this.start()方法中的提示覆盖
						uni.$u.toast(data.msg);
						// 通知验证码组件内部开始倒计时
						this.$refs.uCode1.start();
					} else {
						// 这里此提示会被this.start()方法中的提示覆盖
						uni.$u.toast(data.msg);
					}
				} else {
					uni.$u.toast('请倒计时结束后再发送');
				}
			},
			async Submit() {
				if (this.form.step == 2) {
					let oldPass = {
						// 字段名
						name: 'oldpassword',
						rules: ['require', 'min:6'],
						errorMsg: {
							require: '请输入原密码',
							min: '原密码最少6位'
						}
					}
					let codeRule = {
						// 字段名
						name: 'code',
						rules: ['require', 'integer', 'min:6'],
						errorMsg: {
							require: '请输入验证码',
							integer: '验证码只能为数字',
							min: '验证码为6位'
						}
					}
					var rule = [{
						// 字段名
						name: 'password',
						rules: ['require', 'min:6'],
						errorMsg: {
							require: '请输入新密码',
							min: '新密码最少6位',
						}
					}, {
						// 字段名
						name: 'conpassword',
						rules: ['require', 'confirm:password'],
						errorMsg: {
							require: '请输入确认密码',
							confirm: '两次密码输入不一致'
						}
					}];
					if (this.edit_pwd_sms_enable == '1') {
						rule.push(codeRule);
					}else{
						rule.unshift(oldPass)
					}
					// 是否全部通过，返回Boolean
					let checked = validate.check(this.form, rule);
					if (!checked) {
						// 获取错误信息
						let err = validate.getError();
						uni.$u.toast(err[0])
						return;
					}
					_this.btnDisabled=true
				}
				const data = await _this.$post('api/set_password',this.form)
				if (data.code == 200) {
					this.$u.toast(data.msg)
				} else if (data.code == 10) {
					_this.show=true
					this.edit_pwd_sms_enable = data.data.edit_pwd_sms_enable
					this.sms_time_out = data.data.sms_time_out
					this.mobile = data.data.mobile
				} else {
					this.$u.toast(data.msg)
				}
				setTimeout(()=>{
					_this.btnDisabled=false
				},2000)
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "@/static/css/form.scss";
	.container {
		padding: 0;
		.form-container{
			padding: 20rpx 30rpx 0 30rpx;
			.submit-form-group{
				padding: 0 30rpx;
			}
		}
	}
</style>
